<extend name="./base"/>
<block name="main">
    <div class="row col-md-8 col-md-offset-2" style="margin-top: 20px;">
        <div class="col-md-12">
            <div class="alert alert-success alert-block fade in">
                <button data-dismiss="alert" class="close close-sm" type="button">
                    <i class="fa fa-times"></i>
                </button>
                <h4>
                    <i class="icon-ok-sign"></i>
                    主人寄语
                </h4>
                <p>{$master_comment}</p>
            </div>
        </div>
        <div class="col-md-12">
            <div class="panel">
                <header class="panel-heading">
                    发表您的留言
                                    <span class="tools pull-right">
                                        <a href="javascript:;" class="fa fa-chevron-down"></a>
                                        <a href="javascript:;" class="fa fa-times"></a>
                                     </span>
                </header>
                <div class="p-0 panel-body ">
                    <form>
                        <textarea placeholder="快来留言啊！" rows="2"
                                  class="form-control input-lg p-text-area message-content"></textarea>
                    </form>
                    <footer class="panel-footer">
                        <button class="btn btn-post pull-right send">发表</button>
                        <label class="pull-right"><input type="checkbox" name="is_private" class="is_private"
                                                         value="1"/>私密留言</label>
                        <ul class="nav nav-pills p-option">

                        </ul>
                    </footer>
                </div>
            </div>
        </div>

        <div class="col-md-12">
            <div class="panel">
                <header class="panel-heading">
                    我的留言
                                    <span class="tools pull-right">
                                        <a href="javascript:;" class="fa fa-chevron-down"></a>
                                        <a href="javascript:;" class="fa fa-times"></a>
                                     </span>
                </header>
                <div class="panel-body">
                    <ul class="activity-list message-list">
                        <php>$floor = 0;</php>
                        <if condition="count($messageData) gt 0">
                            <volist name="messageData" id="v">
                                <if condition="($v['is_private'] neq 1) OR ($myUserData['id'] eq $v['who_id']) OR ($myUserData['id'] eq $v['uid'])">
                                    <li message_id="{$v['id']}">
                                        <div class="avatar">
                                            <img alt="" src="__PUBLIC__{$v['zonedp']}">
                                        </div>
                                        <div class="activity-desk">

                                            <h5><a href="#">{$v['username']}</a>
                                                <span>{$v['content']}</span></h5>
                                            <p class="text-muted col-md-4">{:date('Y-m-d
                                                H:i',$v['ctime'])} <?php if($isMy || $myUserData['id']==$v['uid']):?>
                                                <span class="message-reply">回复</span><?php endif;?>
                                                　<?php if($isMy || $myUserData['id']==$v['uid']):?><span class="del"
                                                                                                         message_id="{$v['id']}">删除</span><?php endif;?>
                                            </p>

                                        </div>
                                        <div class="clear"></div>
                                        <div class="reply col-md-4 col-md-offset-1">
                                            <if condition="count($v['replys']) gt 0">
                                                <?php foreach($v['replys'] as $r):?>
                                                <div class="avatar">
                                                    <img alt="" src="__PUBLIC__<?=$r['zonedp']?>">
                                                </div>
                                                <div class="activity-desk">

                                                    <h5><a href="#"><?=$r['username']?></a>
                                                        <span><?=$r['content']?></span></h5>
                                                    <p class="text-muted"><?=date('Y-m-d H:i',$r['ctime'])?></p>

                                                </div>
                                                <?php endforeach;?>
                                            </if>

                                        </div>
                                    </li>
                                </if>
                                <php>$floor++;</php>
                            </volist>
                            <else/>
                            <span>暂无留言，快来抢沙发吧！</span>
                        </if>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</block>
<block name="script">
    <script>
        var floor = {$floor};
        $('.send').click(function () {
//            console.log($('.is_private:checked').val());
            var content = $('.message-content').val();
            var who_id = {$userData['id']};
            var is_private = $('.is_private:checked').val();
            $.ajax({
                type: 'post',
                url: "{:U('Liuyanban/add',array('user_id'=>$myUserData['id']))}",
                data: {
                    content: content,
                    who_id: who_id,
                    is_private: is_private,
                },
                success: function (data) {
                    if (data.status == '0') {
                        //插入成功，添加新的一楼，但需要判断是否为空的。
                        if (floor <= 0) {
                            $('.message-list').empty();
                        }
                        $('.message-list').prepend("<li>\
                                    <div class='avatar'>\
                                <img alt='' src='__PUBLIC__" + data.zonedp + "'>\
                                </div>\
                                <div class='activity-desk'>\
                                <h5><a href='#'>" + data.username + "</a>\
                        <span>" + content + "</span></h5>\
                        <p class='text-muted'>刚刚</p>\
                        </div>\
                        </li>");
                    } else {
                        alert('添加失败');
                    }
                }
            });
        });
        $('.del').click(function () {
            var message_id = $(this).attr('message_id');
            var obj = $(this);
            $.ajax({
                type: 'post',
                url: "{:U('Liuyanban/del',array('user_id'=>$myUserData['id']))}",
                data: {
                    message_id: message_id,
                },
                success: function (data) {
                    if (data.status == '0') {
                        $(obj).parent().parent().parent().remove();
                        alert('删除成功！');
                    } else {
                        alert('删除失败！');
                    }
                }
            });
        });
        $('.message-reply').click(function () {
            if ($(this).parent().parent().next().next().find('.replyler').length > 0) {
                //已经创建了回复工具
                $('.replyler').remove();
                return false;
            }
            $('.replyler').remove();
            $(this).parent().parent().next().next().append('<div class="replyler">\
                    <textarea placeholder="快来留言啊！" rows="2" class="form-control input-lg"></textarea>\
                    <button onclick="sendReply(this);">提交</button><button onclick="clearReply(this);">取消</button>\
                    </div>');
        });
        function sendReply(obj) {
            //1.收集数据。2.发送数据。3.提示结果。4.删除回复器。5.添加回复
            var content = $('.replyler textarea').val();
            var message_id = $(obj).parent().parent().parent().attr('message_id');
            var objobj = obj
            $.ajax({
                type: 'post',
                url: "{:U('Liuyanban/reply',array('user_id'=>$myUserData['id']))}",
                data: {
                    message_id: message_id,
                    content: content,
                },
                success: function (data) {
                    if (data.status == '0') {
                        $(objobj).parent().remove();
                        window.location.href = window.location.href;
                    }
                    alert(data.message);
                }
            });
        }
        function clearReply(obj) {
            $(obj).parent().remove();
        }
    </script>
</block>

